<template>
    <div class="mycomments">
        <Header v-bind:isBack="isBack" v-bind:title="title"></Header>
        <div class="comments-list" v-if="commentslist[0]">
            <div class="list-item bg-f padding-24 " v-for="(item,index) in commentslist" :key="index">
                <div class="top center-col">
                    <img :src="item.cove" alt="">
                    <p class="fs-32 overFlow">{{item.showname}}</p>
                </div>
                <div class="comments-content fs-32 color-6">
                    {{item.comments}}
                </div>
                <div class="time fs-24 color-9">
                    {{item.time}}
                </div>
            </div>
        </div>
    </div>
</template>
<script>
export default {
    data(){
        return{
            isBack:true,
            title:'我的评论',
            commentslist:[
                {
                    cove:require("../../assets/image/cove.png"),
                    showname:'电台节目 【节目名称节目名称节目名称】哈哈哈哈 好',
                    comments:'评论内容评论内容平林内容评论内容评论内容平林内容评论内容评论内容',
                    time:'1小时前'
                },
                {
                    cove:require("../../assets/image/cove.png"),
                    showname:'电台节目 【节目名称节目名称节目名称】哈哈哈哈 好',
                    comments:'评论内容评论内容平林内容评论内容评论内容平林内容评论内容评论内容',
                    time:'1小时前'
                }
            ]
        }
    }
}
</script>
<style lang="scss" scoped>
.mycomments{
    .comments-list{
        margin-top: 1rem;
        .list-item{
            //padding: 0.2rem 0.24rem;
            border-bottom: 0.01rem solid #e9e9e9;
            .top{
                width: 100%;
                height: 1.12rem;
                img{
                    width: 0.72rem;
                    height: 0.72rem;
                    border-radius: 0.1rem;
                    margin-right: 0.2rem;
                }
            }
            .time{
                line-height: 1rem;
            }
        }
    }
}
</style>